<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<div id="div1">
    <p id="intro">hello world!</p>
    <p>下面加一个p元素</p>
</div>
<script type="text/javascript">
    $.get('../static/js/data2.json', function(data) {
        var tab=document.createElement("table");
        var element=document.getElementById("div1");
        element.appendChild(tab);

        for(x in data) {
            var tr = document.createElement("tr");
            tab.appendChild(tr);
            var td2=document.createElement("td");
            // 下面三行，加标签
            var field=document.createTextNode(x);
            tr.appendChild(td2);
            td2.appendChild(field);
            for(i in data[x])
            {
                var td1 = document.createElement("td");
                var cont = document.createTextNode(data[x][i]);
                tr.appendChild(td1);
                td1.appendChild(cont);
            }


        }
    },'json');
</script>

</body>
</html>